<template>
	<view>
		<view class="lb-main-32">
			<view class="lb-box">
				<image src="/static/bg-imgs/balance.png" mode=""></image>
				<view class="lb-item">
					<view class="left">
						<view class="price">
							{{myBalance}}
						</view>
						<view class="label">
							分销佣金
						</view>
					</view>
					<view class="right" @click="goSub(1)">
						提现
					</view>
				</view>
			</view>
		</view>
		<view class="lb-main-32">
			<view class="lb-box">
				<image src="/static/bg-imgs/balance.png" mode=""></image>
				<view class="lb-item">
					<view class="left">
						<view class="price">
							{{CBalance||0}}
						</view>
						<view class="label">
							渠道收益
						</view>
					</view>
					<view class="right" @click="goSub(2)">
						提现
					</view>
				</view>
			</view>

		</view>
	</view>
</template>

<script>
	import {
		getBalance,
		distribution
	} from "@/api/apis/comm.js"
	export default {
		data() {
			return {
				myBalance: 0,//分销佣金
				CBalance: 0,//渠道收益

			}
		},
		onLoad() {
			this.getInfo();
		},
		methods: {
			async getInfo() {
				let res = await getBalance()
				this.myBalance = res.data.f_balance
				this.CBalance = res.data.c_balance
			},
			goSub(type) {
				uni.showModal({
					title: "提现",
					editable: true,
					placeholderText: "请输入提现金额",
					confirmColor: "#F65D40",
					success: (res) => {
						console.log(res)
						if (res.content) {
							distribution({
								amount: res.content,
								type
							}).then(res => {
								if (res.code == 1) {
									if (Number(type) == 1) {
									    this.myBalance = res.data.balance;
									} else {
									    this.CBalance = res.data.balance;
									}
									uni.showToast({
										title: res.msg,
										icon: "none"
									})
								}
							})
						}
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	.lb-box {
		position: relative;
		width: 100%;
		height: 172rpx;

		image {
			position: absolute;
			left: 0;
			top: 0
		}

		.lb-item {
			position: relative;
			display: flex;
			justify-content: space-between;
			align-items: center;
			height: 172rpx;
			padding: 0 24rpx;


			.left {
				display: flex;
				flex-direction: column;

				.price {
					font-size: 48rpx;
					color: #FFFFFF;

					&::after {
						content: ' 元';
						font-size: 20rpx;
					}
				}

				.label {
					padding-top: 8rpx;
					font-size: $main-font-24;
					color: #FFFFFF;
				}
			}

			.right {
				width: 120rpx;
				height: 56rpx;
				background: rgba(255, 255, 255, 1);
				border-radius: 30rpx;
				line-height: 54rpx;
				text-align: center;

				font-size: $main-font-28;
				color: #F65D40;
			}
		}
	}
</style>